
<!DOCTYPE html>
<html lang="en">
    <head><meta name="generator" content="Hexo 3.9.0">
    
        <title>FairyGUI - 字体的处理</title>
    
        <meta charset="utf-8">
        <meta name="description" content="FairyGUI教程">
        <meta name="keywords" content="FairyGUI,FGUI,FairyGUI教程">
        
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">

        <meta property="og:type" content="article">
        <meta property="og:title" content="-字体的处理FairyGUI">
        <meta property="og:description" content="FairyGUI教程">

        <meta name="twitter:card" content="summary">
        <meta name="twitter:title" content="字体的处理 — FairyGUI">
        <meta name="twitter:description" content="FairyGUI教程">

      <!--  <link href='//fonts.proxy.ustclug.org/css?family=Source+Sans+Pro:300,400,600|Roboto Mono' rel='stylesheet' type='text/css'> -->

        <!-- main page styles -->
        <link rel="stylesheet" href="/docs/css/page.css">

        <!-- this needs to be loaded before guide's inline scripts -->
        <script src="/docs/js/vue.min.js"></script>
        <script>window.PAGE_TYPE = "guide_unity"</script>
    </head>
    <body class="docs">        <div id="mobile-bar" data-bg-text="FairyGUI">
            <a class="menu-button"></a>
        </div>
        <div id="header">
  <ul id="nav">
    <li><a href="/docs/guide/" class="nav-link current">教程</a></li>
<li><a href="/docs/examples/" class="nav-link">在线示例</a></li>
<li><a href="/docs/release_notes/" class="nav-link">发行日志</a></li>
<li><a href="/" class="nav-link">首页</a></li>
  </ul>
</div>

        
            <div id="main" class="fix-sidebar">
                
                    
    <div class="sidebar">
    <ul class="main-menu">
        <li><a href="/docs/guide/" class="nav-link current">教程</a></li>
<li><a href="/docs/examples/" class="nav-link">在线示例</a></li>
<li><a href="/docs/release_notes/" class="nav-link">发行日志</a></li>
<li><a href="/" class="nav-link">首页</a></li>
    </ul>
    <div class="list">
        <ul class="menu-root">
            

	 			
	                
	                <li>
	                    <a href="/docs/guide/index.html" class="sidebar-link">导读</a>
	                </li>
	            
	
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/index.html" class="sidebar-link">编辑器使用基础</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/project_settings.html" class="sidebar-link">项目设置</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/package.html" class="sidebar-link">包</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/branch.html" class="sidebar-link">分支</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/publish.html" class="sidebar-link">发布</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/object.html" class="sidebar-link">元件</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/image.html" class="sidebar-link">图片</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/movieclip.html" class="sidebar-link">动画</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/graph.html" class="sidebar-link">图形</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/loader.html" class="sidebar-link">装载器</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/text.html" class="sidebar-link">文本</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/richtext.html" class="sidebar-link">富文本</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/group.html" class="sidebar-link">组</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/component.html" class="sidebar-link">组件</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/scrollpane.html" class="sidebar-link">滚动容器</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/controller.html" class="sidebar-link">控制器</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/relation.html" class="sidebar-link">关联系统</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/label.html" class="sidebar-link">标签</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/button.html" class="sidebar-link">按钮</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/combobox.html" class="sidebar-link">下拉框</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/progressbar.html" class="sidebar-link">进度条</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/slider.html" class="sidebar-link">滑动条</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/scrollbar.html" class="sidebar-link">滚动条</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/list.html" class="sidebar-link">列表</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/tree.html" class="sidebar-link">树</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/popup.html" class="sidebar-link">Popup</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/dragdrop.html" class="sidebar-link">Drag&Drop</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/window.html" class="sidebar-link">窗口系统</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/transition.html" class="sidebar-link">动效</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/adaptation.html" class="sidebar-link">适配</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/i18n.html" class="sidebar-link">多国语言</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/export.html" class="sidebar-link">导入和导出</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/preference.html" class="sidebar-link">偏好设置</a>
	                </li>
	            
	                
	                <li>
	                    <a href="/docs/guide/editor/plugin.html" class="sidebar-link">插件</a>
	                </li>
	            
	
	            
	                
	                
	                <li><h3>SDK</h3></li>
	                
	                <li>
	                    <a href="/docs/guide/sdk/laya.html" class="sidebar-link">LayaAir</a>
	                </li>
	            
	                
	                
	                <li>
	                    <a href="/docs/guide/sdk/egret.html" class="sidebar-link">Egret</a>
	                </li>
	            
	                
	                
	                <li>
	                    <a href="/docs/guide/sdk/cocos2dx.html" class="sidebar-link">Cocos2dx</a>
	                </li>
	            
	                
	                
	                <li>
	                    <a href="/docs/guide/sdk/creator.html" class="sidebar-link">Cocos Creator</a>
	                </li>
	            
	                
	                
	                <li>
	                    <a href="/docs/guide/sdk/cryengine.html" class="sidebar-link">Cry Engine</a>
	                </li>
	            

	            
	                
	                
	                <li><h3>SDK - Unity</h3></li>
	                
	                <li>
	                    <a href="/docs/guide/unity/index.html" class="sidebar-link">显示UI面板</a>
	                </li>
	            
	                
	                
	                <li>
	                    <a href="/docs/guide/unity/transform.html" class="sidebar-link">坐标系统</a>
	                </li>
	            
	                
	                
	                <li>
	                    <a href="/docs/guide/unity/atlas.html" class="sidebar-link">纹理集的处理</a>
	                </li>
	            
	                
	                
	                <li>
	                    <a href="/docs/guide/unity/font.html" class="sidebar-link current">字体的处理</a>
	                </li>
	            
	                
	                
	                <li>
	                    <a href="/docs/guide/unity/input.html" class="sidebar-link">输入处理</a>
	                </li>
	            
	                
	                
	                <li>
	                    <a href="/docs/guide/unity/event.html" class="sidebar-link">事件机制</a>
	                </li>
	            
	                
	                
	                <li>
	                    <a href="/docs/guide/unity/insert3d.html" class="sidebar-link">插入模型/粒子/Spine/Canvas</a>
	                </li>
	            
	                
	                
	                <li>
	                    <a href="/docs/guide/unity/uipainter.html" class="sidebar-link">曲面UI</a>
	                </li>
	            
	                
	                
	                <li>
	                    <a href="/docs/guide/unity/drawcall.html" class="sidebar-link">DrawCall优化</a>
	                </li>
	            
	                
	                
	                <li>
	                    <a href="/docs/guide/unity/lua.html" class="sidebar-link">在Lua中使用</a>
	                </li>
	            
	                
	                
	                <li>
	                    <a href="/docs/guide/unity/special.html" class="sidebar-link">特色功能</a>
	                </li>
	            
	                
	                
	                <li>
	                    <a href="/docs/guide/unity/faq.html" class="sidebar-link">常见问题</a>
	                </li>
	            

            
        </ul>
    </div>
</div>


<div class="content guide_unity with-sidebar ">
    
      <h1>字体的处理</h1>
    
    <h2 id="使用动态字体"><a href="#使用动态字体" class="headerlink" title="使用动态字体"></a>使用动态字体</h2><p>直接使用字体名称即可。例如，设置全局字体：</p>
<figure class="highlight csharp"><table><tr><td class="code"><pre><span class="line">UIConfig.defaultFont = <span class="string">"Droid Sans Fallback, LTHYSZK, Helvetica-Bold, Microsoft YaHei, SimHei"</span>;</span><br></pre></td></tr></table></figure>
<p>多个字体名称用逗号隔开。Unity会自动使用第一个能识别的字体名称。但必须有一个是能识别的。能识别的意思是，<strong>必须是在系统环境中存在的字体，且字体名称一定要正确</strong>。假设你设置了“微软雅黑”，那手机上肯定是没有的，显示效果就达不到期望。</p>
<p> <strong>WebGL平台不支持动态字体（Unity不支持），你必须使用TTF字体</strong>。</p>
<h2 id="使用TTF字体"><a href="#使用TTF字体" class="headerlink" title="使用TTF字体"></a>使用TTF字体</h2><p>Unity支持直接使用TTF字体资源，只需要将文件名称作为字体名称即可，假设font1.ttf已经放置放置在Resources目录：</p>
<figure class="highlight csharp"><table><tr><td class="code"><pre><span class="line">UIConfig.defaultFont = <span class="string">"font1"</span>;</span><br></pre></td></tr></table></figure>
<p>如果TTF文件是放置在Resources目录或者Resources/Fonts目录，那么直接使用字体文件名即可。如果是其他路径，还需要加上路径，假设是放置在Resources/SomePath：</p>
<figure class="highlight csharp"><table><tr><td class="code"><pre><span class="line">UIConfig.defaultFont = <span class="string">"SomePath/font1"</span>;</span><br></pre></td></tr></table></figure>
<p>一般来说，字体文件放到Resources目录下即可，如果需要将字体打包到AssetBundle，那么需要自行加载并注册字体，例如：</p>
<figure class="highlight csharp"><table><tr><td class="code"><pre><span class="line">Font myFont = myBundle.LoadAsset&lt;Font&gt;(name);</span><br><span class="line">FontManager.RegisterFont(<span class="keyword">new</span> DynamicFont(<span class="string">"字体名称"</span>, myFont),<span class="string">"字体名称"</span>);</span><br></pre></td></tr></table></figure>
<h2 id="字体映射"><a href="#字体映射" class="headerlink" title="字体映射"></a>字体映射</h2><p>如果你的界面使用了多种字体，例如对单独的文字设置了字体：</p>
<p><img src="../../images/2016-07-06_143622.png" alt></p>
<p>这里用到了”黑体”这个名字的字体，但”黑体”未必能被Unity识别，更加不能在手机上生效。我们需要建立一个这种字体到已知字体的映射。假设我们已经按照上述方法，准备好一个TTF字体HeiTi.ttf，然后：</p>
<figure class="highlight csharp"><table><tr><td class="code"><pre><span class="line">FontManager.RegisterFont(FontManager.GetFont(<span class="string">"HeiTi"</span>), <span class="string">"黑体"</span>);</span><br></pre></td></tr></table></figure>
<p>RegisterFont的第二个参数对应编辑器里使用的字体名称；第一个参数，就是Unity能识别的字体名称，参考上面的“使用动态字体”和“使用TTF字体”。</p>
<h2 id="常见问题"><a href="#常见问题" class="headerlink" title="常见问题"></a>常见问题</h2><h3 id="字体显示变扁了"><a href="#字体显示变扁了" class="headerlink" title="字体显示变扁了"></a>字体显示变扁了</h3><p>当你使用部分字体的粗体效果时，你会发现粗体的效果在Unity中的显示不正确，这是因为有些字体不带粗体效果的，这时候Unity就会用拉宽来实现，就像变扁了。FairyGUI可以用额外的mesh来解决粗体的显示。方法是：</p>
<figure class="highlight csharp"><table><tr><td class="code"><pre><span class="line">FontManager.GetFont(<span class="string">"字体名称"</span>).customBold = <span class="literal">true</span>;</span><br></pre></td></tr></table></figure>
<p>某些字体，Unity渲染有粗体效果，但当设置成斜体时，粗体效果又丢失（例如雅黑）。FairyGUI在这种情况可以取消Unity默认渲染粗体的效果，改为增加额外的面渲染粗体。激活这个功能的方法是</p>
<figure class="highlight csharp"><table><tr><td class="code"><pre><span class="line">FontManager.GetFont(<span class="string">"字体名称"</span>).customBoldAndItalic = <span class="literal">true</span>;</span><br></pre></td></tr></table></figure>
<p>如果已经设置了customBold，不需要再设置customBoldAndItalic。</p>
<h3 id="文字全部显示为黑色"><a href="#文字全部显示为黑色" class="headerlink" title="文字全部显示为黑色"></a>文字全部显示为黑色</h3><p>SDK安装不完整，没有放置FairyGUI的着色器。</p>
<h3 id="字体显示效果不对"><a href="#字体显示效果不对" class="headerlink" title="字体显示效果不对"></a>字体显示效果不对</h3><ul>
<li><p>如果是动态字体，那么你需要再次确认你的操作系统（例如Windows）里是否有安装这种字体，字体名称是否正确。<strong>对于部分字体，Unity能识别的字体名称不一定是字体的中文名称</strong>。查看准确的系统字体名称，你可以将ttf文件拖入到Unity，就可以在Inspector的”Font Names”里看到正确的字体名称。也可以下载FontCreator软件，查看字体的Font Family属性。</p>
</li>
<li><p>如果是TTF字体，运行时在Project视图，点击TTF文件左边的箭头后，可以看到TTF文件下有Font Texture和Font Material。Font Texture里应该有你游戏中使用到的文字，并能看到渲染效果。如果能看到，说明这个字体在Unity中的渲染效果就是这个样子。</p>
<p><img src="../../images/20170808230450.png" alt></p>
</li>
</ul>
<h3 id="文字出现破碎或者紫色"><a href="#文字出现破碎或者紫色" class="headerlink" title="文字出现破碎或者紫色"></a>文字出现破碎或者紫色</h3><p>Unity为字体维护一个动态贴图，里面包含了当前用到的文字。当发生文本赋值时，如果当前贴图不足以容纳新的文字，Unity就会自动重建贴图，那么所有文字对应的UV就会发生变化。这时原来已经在显示的文字就会出现异常，比如破碎，紫色之类的效果。</p>
<p>FairyGUI已经为这种情况内置了应对方案，就是在出现这种情况时马上把所有文字重绘一遍。所以网上一些先行撑大文字贴图的方案在FairyGUI这里并不需要。</p>
<p>但FairyGUI进行这种操作是有时间点的，就是StageEngine.LateUpdate里。如果你的文本赋值发生在LateUpdate，而且很不幸执行顺序在StageEngine.LateUpdate之后，那么FairyGUI没有机会再进行补救了，这帧就会出现文字显示异常的情况。</p>
<p>所以要防止这种情况出现，检查你的文本赋值，尽量放在Update里，不要放到LateUpdate里。如果一定是放到LateUpdate里，调整你的MB的执行顺序在StageEngine之前。</p>

    
    <div class="footer">
      发现错误或想贡献文档?
      <a href="https://github.com/fairygui/fairygui.github.io/tree/master/src/guide/unity/font.md" target="_blank">
        在 Github 上编辑此文档!
      </a>
    </div>
</div>

                
            </div>
            <script src="/docs/js/smooth-scroll.min.js"></script>
        

        <!-- main custom script for sidebars, version selects etc. -->        
        <script src="/docs/js/css.escape.js"></script>
        <script src="/docs/js/common.js"></script>
    </body>
</html>
